<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <div id="box">
        <img src="img/0.png" alt="">
        <img src="img/0.png" alt="">
        :
        <img src="img/0.png" alt="">
        <img src="img/0.png" alt="">
        :
        <img src="img/0.png" alt="">
        <img src="img/0.png" alt="">
    </div>
</body>
<script src="../public.js"></script>
<script>
    var aimg = document.querySelectorAll("#box img");
    
    // 初始调用一次数码时钟
    digitalClock();

    setInterval(function(){
        // 计时器每次执行，重新调用数码时钟
        digitalClock();
    }, 1000);


    // 数码时钟的功能
    function digitalClock(){
        // 1. 获取日期对象
        var d = getDate();
        // 2. 拿到时分秒，并转成字符，方便取每一位数字
        var h = d.hours+"";
        var m = d.minutes+"";
        var s = d.seconds+"";
        // 3. 根据时分秒的每一位数字，查找图片
        aimg[0].src = "img/"+ h[0] +".png";
        aimg[1].src = "img/"+ h[1] +".png";
        aimg[2].src = "img/"+ m[0] +".png";
        aimg[3].src = "img/"+ m[1] +".png";
        aimg[4].src = "img/"+ s[0] +".png";
        aimg[5].src = "img/"+ s[1] +".png";
    }

</script>
</html>